<template>
  <div class="ali-pay">
    <order-header title="支付宝支付">
      <template v-slot:tips>
        <span>
          温馨提示：请谨防钓鱼链接或诈骗电话，了解更多
        </span>
      </template>
    </order-header>
    <div class="form" v-html="content">
    </div>
    <loading></loading>
  </div>
</template>

<script>
  import Loading from '@/components/Loading'
  import OrderHeader from '@/components/OrderHeader'
  export default {
    name: 'alipay',
    data() {
      return {
        orderId: this.$route.query.orderId,
        content: ''
      }
    },
    components: {
      Loading, OrderHeader
    },
    mounted() {
      this.paySubmit()
    },
    methods: {
      paySubmit() {
        this.axios.post('/pay',{
          orderId: this.orderId,
          orderName: 'VueMI',
          amount: 0.01,
          payType: 1 // 支付宝
        })
        .then(res => {
          console.log(res)
          this.content = res.content
          setTimeout (() => {
            document.forms[0].submit()
          }, 100)
        })
        .catch(err => {
          console.error(err); 
        })
      }
    }
  }
</script>

<style lang='scss' scoped>

</style>
